<template>
  <h1>{{title}}</h1>
  <button @click="title='new title'">update title</button>  
  <hr/>
  <ul>
      <li v-for="item in list" :key="item">{{item}}</li>
  </ul>
  <button @click="list[0]='vue3'">update first item</button>
</template>

<script>
import {reactive} from 'vue';
export default {
    // props: 接收父组件通过属性传递的数据, 但是必须使用props属性来接收, 否则此拿不到数据
    setup(props,context){
        console.log(props,context);
        const list=reactive(['vue','react','angular']);
        return {
            list
        }
    },
    data(){
        return {
            title:'我的个人网站'
        }
    }
}
</script>

<style>

</style>